<%@ page contentType="text/html;charset=utf-8" %>
<%@taglib prefix="s" uri="/struts-tags" %>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Bootshop online Shopping cart</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <!--Less styles -->
    <!-- Other Less css file //different less files has different color scheam
	<link rel="stylesheet/less" type="text/css" href="${conPath}/themes/less/simplex.less">
	<link rel="stylesheet/less" type="text/css" href="${conPath}/themes/less/classified.less">
	<link rel="stylesheet/less" type="text/css" href="${conPath}/themes/less/amelia.less">  MOVE DOWN TO activate
	-->
    <!--<link rel="stylesheet/less" type="text/css" href="${conPath}/themes/less/bootshop.less">
	<script src="${conPath}/themes/js/less.js" type="text/javascript"></script> -->

    <!-- Bootstrap style -->
    <link id="callCss" rel="stylesheet" href="${conPath}/themes/bootshop/bootstrap.min.css" media="screen"/>
    <link href="${conPath}/themes/css/base.css" rel="stylesheet" media="screen"/>
    <!-- Bootstrap style responsive -->
    <link href="${conPath}/themes/css/bootstrap-responsive.min.css" rel="stylesheet"/>
    <link href="${conPath}/themes/css/font-awesome.css" rel="stylesheet" type="text/css">
    <!-- Google-code-prettify -->
    <link href="${conPath}/themes/js/google-code-prettify/prettify.css" rel="stylesheet"/>
    <!-- fav and touch icons -->
    <link rel="shortcut icon" href="${conPath}/themes/images/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144"
          href="${conPath}/themes/images/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114"
          href="${conPath}/themes/images/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72"
          href="${conPath}/themes/images/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="${conPath}/themes/images/ico/apple-touch-icon-57-precomposed.png">
    <style type="text/css" id="enject"></style>
</head>
<body>
<div id="header">
    <div class="container">
        <div id="welcomeLine" class="row">
            <div class="span6">Welcome!<strong> User</strong></div>
            <div class="span6">
                <div class="pull-right">
                    <a href="product_summary.html"><span class="">Fr</span></a>
                    <a href="product_summary.html"><span class="">Es</span></a>
                    <span class="btn btn-mini">En</span>
                    <a href="product_summary.html"><span>&pound;</span></a>
                    <span class="btn btn-mini">$155.00</span>
                    <a href="product_summary.html"><span class="">$</span></a>
                    <a href="product_summary.html"><span class="btn btn-mini btn-primary"><i
                            class="icon-shopping-cart icon-white"></i> [ 3 ] Itemes in your cart </span> </a>
                </div>
            </div>
        </div>
        <!-- Navbar ================================================== -->
        <div id="logoArea" class="navbar">
            <a id="smallScreen" data-target="#topMenu" data-toggle="collapse" class="btn btn-navbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>

            <div class="navbar-inner">
                <a class="brand" href="index.html"><img src="${conPath}/themes/images/logo.png" alt="Bootsshop"/></a>

                <form class="form-inline navbar-search" method="post" action="products.html">
                    <input id="srchFld" class="srchTxt" type="text"/>
                    <select class="srchTxt" >
                        <option>All</option>
                        <option>CLOTHES</option>
                        <option>FOOD AND BEVERAGES</option>
                        <option>HEALTH & BEAUTY</option>
                        <option>SPORTS & LEISURE</option>
                        <option>BOOKS & ENTERTAINMENTS</option>
                    </select>
                    <button type="submit" id="submitButton" class="btn btn-primary">Go</button>
                </form>
                <ul id="topMenu" class="nav pull-right">
                    <li class=""><a href="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&searchType=Specials Offer">Specials Offer</a></li>
                    <li class=""><a href="normal.html">Delivery</a></li>
                    <li class=""><a href="contact.html">Contact</a></li>
                    <li class="">
                        <a href="#login" role="button" data-toggle="modal" style="padding-right:0"><span
                                class="btn btn-large btn-success">Login</span></a>

                        <div id="login" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="login"
                             aria-hidden="false">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                                    <h3>Login Block</h3>
                            </div>
                            <div class="modal-body">
                                <form class="form-horizontal loginFrm">
                                    <div class="control-group">
                                        <input type="text" id="inputEmail" placeholder="Email">
                                    </div>
                                    <div class="control-group">
                                        <input type="password" id="inputPassword" placeholder="Password">
                                    </div>
                                    <div class="control-group">
                                        <label class="checkbox">
                                            <input type="checkbox"> Remember me
                                        </label>
                                    </div>
                                </form>
                                <button type="submit" class="btn btn-success">Sign in</button>
                                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!-- Header End====================================================================== -->
<div id="mainBody">
    <div class="container">
        <div class="row">
            <!-- Sidebar ================================================== -->
            <div id="sidebar" class="span3">
                <div class="well well-small"><a id="myCart" href="product_summary.html"><img
                        src="${conPath}/themes/images/ico-cart.png" alt="cart">3 Items in your cart <span
                        class="badge badge-warning pull-right">$155.00</span></a></div>
                <ul id="sideManu" class="nav nav-tabs nav-stacked">
                    <li class="subMenu open"><a> ELECTRONICS [230]</a>
                        <ul>
                            <li><a class="active" href="${conPath}/product/search.action?categoryId=???"><i
                                    class="icon-chevron-right"></i>Cameras (100) </a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Computers, Tablets & laptop
                                (30)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Mobile Phone (80)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Sound & Vision (15)</a></li>
                        </ul>
                    </li>
                    <li class="subMenu"><a> CLOTHES [840] </a>
                        <ul style="display:none">
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Women's Clothing (45)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Women's Shoes (8)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Women's Hand Bags (5)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Men's Clothings (45)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Men's Shoes (6)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Kids Clothing (5)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Kids Shoes (3)</a></li>
                        </ul>
                    </li>
                    <li class="subMenu"><a>FOOD AND BEVERAGES [1000]</a>
                        <ul style="display:none">
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Angoves (35)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Bouchard Aine & Fils (8)</a>
                            </li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>French Rabbit (5)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Louis Bernard (45)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>BIB Wine (Bag in Box) (8)</a>
                            </li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Other Liquors & Wine (5)</a>
                            </li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Garden (3)</a></li>
                            <li><a href="products.html"><i class="icon-chevron-right"></i>Khao Shong (11)</a></li>
                        </ul>
                    </li>
                    <li><a href="products.html">HEALTH & BEAUTY [18]</a></li>
                    <li><a href="products.html">SPORTS & LEISURE [58]</a></li>
                    <li><a href="products.html">BOOKS & ENTERTAINMENTS [14]</a></li>
                </ul>
                <br/>

                <div class="thumbnail">
                    <img src="${conPath}/themes/images/products/panasonic.jpg" alt="Bootshop panasonoc New camera"/>

                    <div class="caption">
                        <h5>Panasonic</h5>
                        <h4 style="text-align:center"><a class="btn" href="product_details.html"> <i
                                class="icon-zoom-in"></i></a> <a class="btn" href="#">Add to <i
                                class="icon-shopping-cart"></i></a> <a class="btn btn-primary" href="#">$222.00</a></h4>
                    </div>
                </div>
                <br/>

                <div class="thumbnail">
                    <img src="${conPath}/themes/images/products/kindle.png" title="Bootshop New Kindel"
                         alt="Bootshop Kindel">

                    <div class="caption">
                        <h5>Kindle</h5>
                        <h4 style="text-align:center"><a class="btn" href="product_details.html"> <i
                                class="icon-zoom-in"></i></a> <a class="btn" href="#">Add to <i
                                class="icon-shopping-cart"></i></a> <a class="btn btn-primary" href="#">$222.00</a></h4>
                    </div>
                </div>
                <br/>

                <div class="thumbnail">
                    <img src="${conPath}/themes/images/payment_methods.png" title="Bootshop Payment Methods"
                         alt="Payments Methods">

                    <div class="caption">
                        <h5>Payment Methods</h5>
                    </div>
                </div>
            </div>
            <!-- Sidebar end=============================================== -->
            <div class="span9">
                <ul class="breadcrumb">
                    <li><a href="index.html">Home</a> <span class="divider">/</span></li>
                    <li class="active">Products Name</li>
                </ul>
                <h3> Products Name
                    <small class="pull-right"> 40 products are available</small>
                </h3>
                <hr class="soft"/>
                <p>
                    Nowadays the lingerie industry is one of the most successful business spheres.We always stay in
                    touch with the latest fashion tendencies - that is why our goods are so popular and we have a great
                    number of faithful customers all over the country.
                </p>
                <hr class="soft"/>
                <form class="form-horizontal span6">
                    <div class="control-group">
                        <label class="control-label alignL">Sort By </label>
                        <select name="mylink" onchange="location.href=this.options[this.selectedIndex].value">
                            <option value="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&sortBy=Product name A - Z&sortOrder=<s:property value="sortOrder"/>" selected>Product name A - Z</option>
                            <option value="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&sortBy=Poiduct name Z - A&sortOrder=<s:property value="sortOrder"/>">Product name Z - A</option>
                            <option value="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&sortOrder=Product Stoke&sortBy=<s:property value="sortBy"/>">Product Stoke</option>
                            <option value="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&sortOrder=Price Lowest first&sortBy=<s:property value="sortBy"/>">Price Lowest first</option>
                        </select>
                    </div>
                </form>

                <div id="myTab" class="pull-right">
                    <a href="#listView" data-toggle="tab"><span class="btn btn-large"><i
                            class="icon-list"></i></span></a>
                    <a href="#blockView" data-toggle="tab"><span class="btn btn-large btn-primary"><i
                            class="icon-th-large"></i></span></a>
                </div>
                <br class="clr"/>

                <div class="tab-content">
                    <div class="tab-pane" id="listView">
                        <!-- 遍历产品 -->
                        <s:iterator value="page.data">
                            <div class="row">
                                <div class="span2">
                                    <s:iterator value="pictures">
                                        <s:if test="cover">
                                            <img src="${conPath}/<s:property value="path" />" alt="<s:property value="alt" />"/>
                                        </s:if>
                                    </s:iterator>
                                </div>
                                <div class="span4">
                                    <h3>New | Available</h3>
                                    <hr class="soft"/>
                                    <h5><s:property value="name"/> </h5>

                                    <p>
                                        Nowadays the lingerie industry is one of the most successful business spheres.We
                                        always stay in touch with the latest fashion tendencies -
                                        that is why our goods are so popular..
                                    </p>
                                    <a class="btn btn-small pull-right" href="${conPath}/product/details.action?product.id=<s:property value="id"/>&categoryId=<s:property value="categoryId"/>">View Details</a>
                                    <br class="clr"/>
                                </div>
                                <div class="span3 alignR">
                                    <form class="form-horizontal qtyFrm">
                                        <h3><s:property value="price"/></h3>
                                        <label class="checkbox">
                                            <input type="checkbox"> Adds product to compair
                                        </label><br/>

                                        <a href="product_details.html" class="btn btn-large btn-primary"> Add to <i
                                                class=" icon-shopping-cart"></i></a>
                                        <a href="${conPath}/product/details.action?product.id=<s:property value="id"/>&categoryId=<s:property value="categoryId"/>" class="btn btn-large"><i
                                                class="icon-zoom-in"></i></a>

                                    </form>
                                </div>
                            </div>
                            <hr class="soft"/>
                        </s:iterator>
                    </div>

                    <div class="tab-pane  active" id="blockView">
                        <ul class="thumbnails">
                            <!-- 遍历-->
                            <s:iterator value="page.data">
                                <li class="span3">
                                    <div class="thumbnail">
                                        <a href="${conPath}/product/details.action?product.id=<s:property value="id"/>&categoryId=<s:property value="categoryId"/>">
                                        <s:iterator value="pictures">
                                            <s:if test="cover">
                                            <img src="${conPath}/<s:property value="path" />" alt="<s:property value="alt" />"/>
                                            </s:if>
                                        </s:iterator>
                                        </a>
                                        <div class="caption">
                                            <h5><s:property value="name"/></h5>

                                            <p>
                                                Stock:<s:property value="stock"/>
                                            </p>
                                            <h4 style="text-align:center"><a class="btn" href="${conPath}/product/details.action?product.id=<s:property value="id"/>&categoryId=<s:property value="categoryId"/>"> <i
                                                    class="icon-zoom-in"></i></a> <a class="btn" href="#">Add to <i
                                                    class="icon-shopping-cart"></i></a> <a class="btn btn-primary"
                                                                                           href="#">&euro;<s:property value="price"/></a></h4>
                                        </div>
                                    </div>
                                </li>
                            </s:iterator>



                        </ul>
                        <hr class="soft"/>
                    </div>
                </div>

                <a href="compair.html" class="btn btn-large pull-right">Compair Product</a>

                <div class="pagination">
                    <ul>
                        <s:if test="pageNumber > 1">
                            <li><a href="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&pageNumber=<s:property value="pageNumber - 1"/>&searchType=<s:property value="searchType"/>">&lsaquo;</a></li>
                        </s:if>
                        <!-- 通过page传过来的数据进行分页 -->
                        <s:iterator begin="1" end="page.totalPage" var="number">
                            <li><a href="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&pageNumber=<s:property value="number"/>&searchType=<s:property value="searchType"/>"><s:property value="number"/></a></li>
                        </s:iterator>
                        <s:if test="pageNumber < page.totalPage">
                            <li><a href="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&pageNumber=<s:property value="pageNumber + 1"/>&searchType=<s:property value="searchType"/>">&rsaquo;</a></li>
                        </s:if>
                    </ul>
                </div>
                <br class="clr"/>
            </div>
        </div>
    </div>
</div>
<!-- MainBody End ============================= -->
<!-- Footer ================================================================== -->
<div id="footerSection">
    <div class="container">
        <div class="row">
            <div class="span3">
                <h5>ACCOUNT</h5>
                <a href="login.html">YOUR ACCOUNT</a>
                <a href="login.html">PERSONAL INFORMATION</a>
                <a href="login.html">ADDRESSES</a>
                <a href="login.html">DISCOUNT</a>
                <a href="login.html">ORDER HISTORY</a>
            </div>
            <div class="span3">
                <h5>INFORMATION</h5>
                <a href="contact.html">CONTACT</a>
                <a href="register.html">REGISTRATION</a>
                <a href="legal_notice.html">LEGAL NOTICE</a>
                <a href="tac.html">TERMS AND CONDITIONS</a>
                <a href="faq.html">FAQ</a>
            </div>
            <div class="span3">
                <h5>OUR OFFERS</h5>
                <a href="#">NEW PRODUCTS</a>
                <a href="#">TOP SELLERS</a>
                <a href="#">SPECIAL OFFERS</a>
                <a href="#">MANUFACTURERS</a>
                <a href="#">SUPPLIERS</a>
            </div>
            <div id="socialMedia" class="span3 pull-right">
                <h5>SOCIAL MEDIA </h5>
                <a href="#"><img width="60" height="60" src="${conPath}/themes/images/facebook.png" title="facebook"
                                 alt="facebook"/></a>
                <a href="#"><img width="60" height="60" src="${conPath}/themes/images/twitter.png" title="twitter"
                                 alt="twitter"/></a>
                <a href="#"><img width="60" height="60" src="${conPath}/themes/images/youtube.png" title="youtube"
                                 alt="youtube"/></a>
            </div>
        </div>
        <p class="pull-right">&copy; Bootshop</p>
    </div>
    <!-- Container End -->
</div>
<!-- Placed at the end of the document so the pages load faster ============================================= -->
<script src="${conPath}/themes/js/jquery.js" type="text/javascript"></script>
<script src="${conPath}/themes/js/bootstrap.min.js" type="text/javascript"></script>
<script src="${conPath}/themes/js/google-code-prettify/prettify.js"></script>

<script src="${conPath}/themes/js/bootshop.js"></script>
<script src="${conPath}/themes/js/jquery.lightbox-0.5.js"></script>

<!-- Themes switcher section ============================================================================================= -->
<div id="secectionBox">
    <link rel="stylesheet" href="${conPath}/themes/switch/themeswitch.css" type="text/css" media="screen"/>
    <script src="${conPath}/themes/switch/theamswitcher.js" type="text/javascript" charset="utf-8"></script>
    <div id="themeContainer">
        <div id="hideme" class="themeTitle">Style Selector</div>
        <div class="themeName">Oregional Skin</div>
        <div class="images style">
            <a href="${conPath}/themes/css/#" name="bootshop"><img src="${conPath}/themes/switch/images/clr/bootshop.png"
                                                                alt="bootstrap business templates" class="active"></a>
            <a href="${conPath}/themes/css/#" name="businessltd"><img
                    src="${conPath}/themes/switch/images/clr/businessltd.png" alt="bootstrap business templates"
                    class="active"></a>
        </div>
        <div class="themeName">Bootswatch Skins (11)</div>
        <div class="images style">
            <a href="${conPath}/themes/css/#" name="amelia" title="Amelia"><img
                    src="${conPath}/themes/switch/images/clr/amelia.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="spruce" title="Spruce"><img
                    src="${conPath}/themes/switch/images/clr/spruce.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="superhero" title="Superhero"><img
                    src="${conPath}/themes/switch/images/clr/superhero.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="cyborg"><img src="${conPath}/themes/switch/images/clr/cyborg.png"
                                                              alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="cerulean"><img src="${conPath}/themes/switch/images/clr/cerulean.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="journal"><img src="${conPath}/themes/switch/images/clr/journal.png"
                                                               alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="readable"><img src="${conPath}/themes/switch/images/clr/readable.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="simplex"><img src="${conPath}/themes/switch/images/clr/simplex.png"
                                                               alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="slate"><img src="${conPath}/themes/switch/images/clr/slate.png"
                                                             alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="spacelab"><img src="${conPath}/themes/switch/images/clr/spacelab.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="united"><img src="${conPath}/themes/switch/images/clr/united.png"
                                                              alt="bootstrap business templates"></a>

            <p style="margin:0;line-height:normal;margin-left:-10px;display:none;">
                <small>These are just examples and you can build your own color scheme in the backend.</small>
            </p>
        </div>
        <div class="themeName">Background Patterns</div>
        <div class="images patterns">
            <a href="${conPath}/themes/css/#" name="pattern1"><img src="${conPath}/themes/switch/images/pattern/pattern1.png"
                                                                alt="bootstrap business templates" class="active"></a>
            <a href="${conPath}/themes/css/#" name="pattern2"><img src="${conPath}/themes/switch/images/pattern/pattern2.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern3"><img src="${conPath}/themes/switch/images/pattern/pattern3.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern4"><img src="${conPath}/themes/switch/images/pattern/pattern4.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern5"><img src="${conPath}/themes/switch/images/pattern/pattern5.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern6"><img src="${conPath}/themes/switch/images/pattern/pattern6.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern7"><img src="${conPath}/themes/switch/images/pattern/pattern7.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern8"><img src="${conPath}/themes/switch/images/pattern/pattern8.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern9"><img src="${conPath}/themes/switch/images/pattern/pattern9.png"
                                                                alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern10"><img
                    src="${conPath}/themes/switch/images/pattern/pattern10.png" alt="bootstrap business templates"></a>

            <a href="${conPath}/themes/css/#" name="pattern11"><img
                    src="${conPath}/themes/switch/images/pattern/pattern11.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern12"><img
                    src="${conPath}/themes/switch/images/pattern/pattern12.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern13"><img
                    src="${conPath}/themes/switch/images/pattern/pattern13.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern14"><img
                    src="${conPath}/themes/switch/images/pattern/pattern14.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern15"><img
                    src="${conPath}/themes/switch/images/pattern/pattern15.png" alt="bootstrap business templates"></a>

            <a href="${conPath}/themes/css/#" name="pattern16"><img
                    src="${conPath}/themes/switch/images/pattern/pattern16.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern17"><img
                    src="${conPath}/themes/switch/images/pattern/pattern17.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern18"><img
                    src="${conPath}/themes/switch/images/pattern/pattern18.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern19"><img
                    src="${conPath}/themes/switch/images/pattern/pattern19.png" alt="bootstrap business templates"></a>
            <a href="${conPath}/themes/css/#" name="pattern20"><img
                    src="${conPath}/themes/switch/images/pattern/pattern20.png" alt="bootstrap business templates"></a>

        </div>
    </div>
</div>
<span id="themesBtn"></span>
</body>
<script type="javascript">

    <%--function sortto(obj){--%>
        <%--var val = this.options[obj.selectedIndex].value;--%>
        <%--&lt;%&ndash;if(val=='Priduct name Z - A'){&ndash;%&gt;--%>
            <%--&lt;%&ndash;location.href="${conPath}/product/search.action?categoryId=<s:property value="page.data[0].category.id"/>&viewType=Lis&sortBy=Priduct name A - Z";&ndash;%&gt;--%>
        <%--&lt;%&ndash;}&ndash;%&gt;--%>
        <%--alert(val);--%>
    <%--}--%>

</script>
</html>